// lib
var $ = require("jquery");
var mui = require("mui");
require("muiCss");

// self global
require("commonJs");
require("commonCss");
require("../css/login-register.scss");

var slider = require("js/ht/slider.js");

$(function () {
  /**
   * 拖动滑块
   */
  var loginSlider = {
    locked: false,
    token: "loginSlider",
  };
  var registerSlider = {
    locked: false,
    token: "registerSlider",
  };
  slider("#login_slide_wrapper", loginSlider, slideConfirm);
  slider("#register_slide_wrapper", registerSlider, slideConfirm);

  // 滑块与后台交互
  function slideConfirm(setBtnStatus, token) {
    var result = false;
    $.ajax({
      url: "http://192.168.1.163/slipverify.html",
      type: "post",
      data: {
        token: token,
      },
      // async: false, // 设置同步
      success: function (res) {
        if (res.code == 0) {
          result = true;
          slide_locked.slider = res.msg;
        }
        setBtnStatus(result);
      },
      error: function (err) {
        mui.alert("验证失败");
        setBtnStatus(false);
      },
    });
  }

  /**
   * 获取验证码
   */
  // var getCodeBtn = $(".get-code");
  // var reg = /^[1]([3-9])[0-9]{9}$/;
  // getCodeBtn.on("tap", function () {
  //   var phone = $(".phone:visible").val();
  //   if (!reg.test(phone)) {
  //     mui.toast("请输入正确格式手机号码！");
  //     return false;
  //   }

  //   mui.alert("发送验证码，手机号码：" + phone);
  //   setCodeTime($(this));
  // });

  /**
   * 登录 js
   */
  // var loginBtn = $(".login-submit");
  // loginBtn.on("tap", function () {
  //   var phone = $(".phone:visible");
  //   var password = $(".password:visible");
  //   var code = $(".code:visible");
  //   var result = {};
  //   if (!reg.test(phone.val())) {
  //     mui.toast("请输入正确格式手机号码！");
  //     return false;
  //   }
  //   if (password.size() > 0 && password.val() === "") {
  //     mui.toast("请输入密码！");
  //     return false;
  //   }
  //   if (code.size() > 0 && code.val() === "") {
  //     mui.toast("请输入验证码！");
  //     return false;
  //   }

  //   result[phone.attr("name")] = phone.val();
  //   result[password.attr("name")] = password.val();
  //   result[code.attr("name")] = code.val();

  //   mui.alert("登录：" + JSON.stringify(result));
  // });

  /**
   * 注册 js
   */
  // var registerBtn = $(".register-submit");
  // registerBtn.on("tap", function () {
  //   var phone = $(".phone:visible");
  //   var password = $(".password:visible");
  //   var passwordConfirm = $(".password-confirm:visible");
  //   var code = $(".code:visible");
  //   var result = {};
  //   if (!reg.test(phone.val())) {
  //     mui.toast("请输入正确格式手机号码！");
  //     return false;
  //   }
  //   if (password.size() > 0 && password.val() === "") {
  //     mui.toast("请输入密码！");
  //     return false;
  //   }
  //   if (passwordConfirm.size() > 0 && passwordConfirm.val() === "") {
  //     mui.toast("请确认密码！");
  //     return false;
  //   }
  //   if (password.val() !== passwordConfirm.val()) {
  //     mui.toast("两次密码输入不一致！");
  //     return false;
  //   }
  //   if (code.size() > 0 && code.val() === "") {
  //     mui.toast("请输入验证码！");
  //     return false;
  //   }

  //   result[phone.attr("name")] = phone.val();
  //   result[password.attr("name")] = password.val();
  //   result[code.attr("name")] = code.val();

  //   mui.alert("登录：" + JSON.stringify(result));
  // });

  /**
   * 登录 切换登录方式
   */
  $("#login-code-item").addClass("hide");
  var psdLogin = $("#password-login");
  psdLogin.on("tap", function () {
    console.log("密码登录");
    $("#login-item").removeClass("hide").addClass("hide");
    $("#login-code-item").removeClass("hide").addClass("mui-active");
  });

  var codeLogin = $("#code-login");
  codeLogin.on("tap", function () {
    console.log("验证码登录");
    $("#login-code-item").removeClass("hide").addClass("hide");
    $("#login-item").removeClass("hide").addClass("mui-active");
  });

  // var toggleBtn = $(".login-toggle");
  // var toggleWrap = $(".toggle-wrap");
  // toggleBtn.on("tap", function () {
  //   var idx = $(this).data("idx");
  //   toggleWrap.removeClass("hide").eq(idx).addClass("hide");
  //   if (idx === 0) {
  //     $(this).data("idx", 1);
  //     $(this).text("密码登陆");
  //   } else {
  //     $(this).data("idx", 0);
  //     $(this).text("手机验证码登陆");
  //   }
  // });

  /**
   * 设置验证码倒计时
   * @param {*} e 验证码按钮jquery dom
   * @param {*} time 持续时间
   */
  function setCodeTime(e, time) {
    var time = time || 60;
    return (function () {
      e.addClass("actived");
      console.log(e.text());
      var timer = setInterval(function () {
        console.log(time);
        if (time > 0) {
          e.text(time + "s重新发送");
          time--;
        } else {
          e.text("发送验证码");
          e.removeClass("actived");
          clearInterval(timer);
        }
      }, 1000);
    })();
  }
  /**
   * 登录、注册切换
   */
  var cName = "mui-active";
  $("#login-register-segmentedControl").on(
    "tap",
    ".mui-control-item",
    function () {
      var idx = $(this).index();
      $(this).parent().children().removeClass(cName);
      $(this).addClass(cName);

      if (idx == 0) {
        $("#login-item").addClass("mui-active").removeClass("hide");
        $("#register-item").removeClass(cName).addClass("hide");
        $("#login-code-item").removeClass(cName).addClass("hide");
      } else if (idx == 1) {
        $("#register-item").addClass("mui-active").removeClass("hide");
        $("#login-item").removeClass(cName).addClass("hide");
        $("#login-code-item").removeClass(cName).addClass("hide");
      }

      // $('.content-wrapper').children().removeClass(cName).eq(idx).addClass(cName)
    }
  );
});
